/**
 * Created by willem
 */
import './index.scss';
import { Component } from 'react';
import T from 'utils/T';

export default class Yutian extends Component {
    constructor(props) {
        super(props);
        this.state = {

            preventData: [
                {
                    name: '灾害敏感单元',
                    value: 120
                },
                {
                    name: '重点危险源',
                    value: 1230
                },
                {
                    name: '气象灾害',
                    value: 1210
                },
                {
                    name: '森林火险',
                    value: 120
                },
                {
                    name: '资质灾害',
                    value: 1410
                },
                {
                    name: '洪涝灾害',
                    value: 5352
                }
            ]
        };
        this.timer = null;
    }


    render() {
        return (<div className={'YutianBox'}>
            <h5 style={{color: '#fff'}}>位置不精确，尚未完善</h5>
            <div className={'content'}>
                {/*防御*/}
                <div className={'disasterPreventionBox'}>
                    <div className={'content'}>
                        <div className={'centerBg'}>
                            <div>灾害防范</div>
                        </div>
                        <div className={'round3dBox'}>
                            <div className="ui_base u_p3d">
                                <div className="base u_p3d topRound" ref={e=> this.topRoundDom = e}>
                                    {/*<div className="pan"></div>*/}
                                    <div className="ball_base u_p3d ball_top1">
                                        <div className="ball">
                                            <strong>{this.state.preventData[0].value}</strong>
                                            <span>{this.state.preventData[0].name}</span>
                                        </div>
                                    </div>
                                    <div className="ball_base u_p3d ball_top2">
                                        <div className="ball">
                                            <strong>{this.state.preventData[1].value}</strong>
                                            <span>{this.state.preventData[1].name}</span>
                                        </div>
                                    </div>
                                </div>
                                <div className="base u_p3d bottomRound" ref={e=> this.bottomRoundDom = e}>
                                    {/*<div className="pan"></div>*/}
                                    <div className="ball_base u_p3d ball_bottom1">
                                        <div className="ball">
                                            <strong>{this.state.preventData[2].value}</strong>
                                            <span>{this.state.preventData[2].name}</span>
                                        </div>
                                    </div>
                                    <div className="ball_base u_p3d ball_bottom2">
                                        <div className="ball">
                                            <strong>{this.state.preventData[3].value}</strong>
                                            <span>{this.state.preventData[3].name}</span>
                                        </div>
                                    </div>
                                    <div className="ball_base u_p3d ball_bottom3">
                                        <div className="ball">
                                            <strong>{this.state.preventData[4].value}</strong>
                                            <span>{this.state.preventData[5].name}</span>
                                        </div>
                                    </div>
                                    <div className="ball_base u_p3d ball_bottom4">
                                        <div className="ball">
                                            <strong>{this.state.preventData[5].value}</strong>
                                            <span>{this.state.preventData[5].name}</span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                    </div>
                </div>
            </div>
        </div>);
    }
}

